.coupon-model {
  .c-model-body {
    max-height: 500px;
    overflow: auto;
  }
  .list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    .item {
      height: 104px;
      width: 374px;
      box-sizing: border-box;
      position: relative;
      cursor: pointer;
      border-radius: 12px;
      padding-left: 30px;
      &:after {
        content: "";
        position: absolute;
        border-radius: 12px;
        top: 0;
        left: 30px;
        right: 20px;
        height: 100%;
        @include background_color();
      }
      .check {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 1;
        left: 0;
        @include icon_check();
      }
      .card {
        display: flex;
        align-items: stretch;
        position: relative;
        z-index: 1;
        height: 100%;
        padding: 5px 0;
        .left {
          width: 102px;
          @include flex_center();
          flex-direction: column;
          color: $-color-brown;

          .money {
            font-size: 16px;

            span {
              font-family: 'changchun1hao';
              font-size: 28px;
            }
          }

          .min-money {
            line-height: 20px;
            padding: 0 6px;
            background: #FFFFFF;
            border-radius: 10px;
            font-size: 12px;
            width: max-content;
            text-align: center;
          }
        }
        .right {
          flex: 1;
          position: relative;
          overflow: hidden;
          border-radius: 0 12px 12px 0;
          padding: 0 28px;
          display: flex;
          flex-direction: column;
          justify-content: space-around;
          color: $-color-brown;
          font-size: 14px;
          font-weight: bold;
          .desc {
            font-weight: 400;
            color: #857151;
            font-size: 12px;
          }
          div {
            position: relative;
            z-index: 1;
          }
          &:after, &:before {
            content: "";
            position: absolute;
          }
          &:after {
            top: 50%;
            transform: translateY(-50%);
            left: 0;
            right: 0;
            height: 220%;
            background: linear-gradient( 90deg, #FEF0D7 0%, #FDE5B6 100%);
            border-radius: 200px 12px 12px 200px;
          }
          &:before {
            right: 15px;
            bottom: 0;
            width: 105px;
            height: 105px;
            background: url("~@/assets/images/coupon/mask-drink.png") no-repeat center / cover;
            z-index: 1;
          }

          &.type-1:before {
            background: url("~@/assets/images/coupon/mask-money.png") no-repeat center / cover;
          }
        }
      }
    }
  }
}

